<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>{$infoConfig.site_title}</title>
    <link href="/admin/login/css/style.css" rel="stylesheet" type="text/css" />
    <link href="/admin/layui/css/layui.css" rel="stylesheet" />
</head>

<body>
<div id="login_wrapper">
    <div><img src="/admin/login/images/1.jpg" width="100%" height="100%" alt="祡色背景图" /></div>
    <div><img src="/admin/login/images/2.jpg" width="100%" height="100%" alt="蓝色背景图" /></div>
    <div><img src="/admin/login/images/3.jpg" width="100%" height="100%" alt="淡黄色背景图" /></div>
</div>
<div id="Tz_Login">
    <h3 id="title" class="move">用户登录</h3>
    <form id="doLogin" name="doLogin" action='{:url("index/login")}' method="post">
        <input type="text" placeholder="用户名" class="txt move" id="username" name="username" required autocomplete="off">
        <input type="password" placeholder="密码" class="txt move" id="password" name="password" required>
        <div class="move">
            <input type="text" placeholder="验证码" class="txt yzm" id="captcha" name="captcha" required>
            <img src='{:url("index/captcha")}' class="txt yzm-img" />
        </div>

        <input type="submit" class="but move" value="登 录" id="submit" />
    </form>
</div>
<script src="/admin/login/js/jquery-1.11.1.min.js"></script>
<script src="/admin/login/js/demo.js"></script>
<script src="/admin/layui/layui.js"></script>
<script src="/admin/js/jquery.form.js"></script>
<script type="text/javascript">
    $(function(){
        $('#doLogin').ajaxForm({
            beforeSubmit: checkForm,	// 此方法主要是提交前执行的方法，根据需要设置
            success: complete,			// 这是提交后的方法
            dataType: 'json'
        });
        function checkForm(){
            console.log('验证表单');
            layui.use("layer",function(){
                if( '' == $.trim($('#username').val())){
                    var name=$("#username").val();
                    layer.msg('请输入登录用户名', {icon: 5,time:2000}, function(index){
                        layer.close(index);
                    });
                    return false;
                }
                if( '' == $.trim($('#password').val())){
                    layer.msg('请输入登录密码', {icon: 5,time:2000}, function(index){
                        layer.close(index);
                    });
                    return false;
                }
            });
        }
        function complete(data){
            console.log(data);
            layui.use("layer",function(){
                if(data.code==1){
                    layer.msg(data.msg, {icon: 6,time:1000}, function(index){
                        layer.close(index);
                        window.location.href = data.data.url;
                    });
                }else{
                    layer.msg(data.msg, {icon: 5,time:2000});
                    return false;
                }
            });
        }

        $(".yzm-img").click(function(){
            console.log('刷新验证码');
            this.src = "{:url('index/captcha')}?"+Math.random();
        });
    });
</script>
</body>
</html>